<!DOCTYPE html>
<html lang="en" xmlns:shiro="http://www.pollix.at/thymeleaf/shiro"
      xmlns:th="http://www.thymeleaf.org">
<head>
  <meta charset="UTF-8">
  <title>Title</title>
  <link rel="stylesheet" href="/layui/css/layui.css">
  <link rel="stylesheet" href="/css/custom.form.css">
</head>
<body>

<div class="table_div">
  <div id="searchParam">
    <div class="layui-form-item">
      <div class="layui-input-inline layui-form">
        <!-- <input type="text" id="regionNameInput" class="layui-input"  autocomplete="off" placeholder="请输入区域名称"> -->
      	<select id="taxorgcodeInput">
		</select>
      </div>
      
      <div class="layui-input-inline">
        <input type="text" id="createTimeInput" class="layui-input"  autocomplete="off" placeholder="请输入时间">
      </div>

      <div class="layui-input-inline ">
        <button class="layui-btn" onclick="search()"  id="search">查询</button>
      </div>
    </div>
	<div id="main" style="width: 1200px;height:350px;"></div>
	
  </div>
</div>

</body>
</html>

<script src="/layui/layui.all.js"></script>
<script src="/js/jquery.min.js"></script>
<script src="/js/core.util.js"></script>
<script src="/js/echarts.min.js"></script>

<script>
  //获取token
  var token = CoreUtil.getData("access_token");
  //地址栏转义token中的#号
  var tokenQuery = token.replace("#", "%23");
  var tableIns1;
  var table = layui.table;
  var form = layui.form;
  var layer = layui.layer;
  var $ = jQuery = layui.jquery;
  var laydate = layui.laydate;
  var date = new Date();
  var year = date.getFullYear();
  $("#createTimeInput").val(year);
  
  $(function() {
	  // 加载机关
      CoreUtil.sendGet("/sys/deptlist",null , function(res) {
			if (res.code == '0') {
				var value = res.data[0];
				var opt = "<option value = ''>请选择所属机关</option>";
				for (var i in value) {
					opt += '<option value = "' + value[i].id + '">'
							+ value[i].name + '</option>';
				}
				
				$("#taxorgcodeInput").html(opt);
				form.render('select'); //需要渲染一下
			} else {
				layer.msg(res.msg);
				return false;
			}
		}, false, false);
		
  });
  
  layui.use(['table', 'layer', 'laydate'], function () {
	  laydate.render({
			elem : '#createTimeInput',
			type : 'year',
		});
	  
	  search();
  });

  //执行查询
  function search() {
	  var myChart = echarts.init(document.getElementById('main'));
			   var map = {
					taxorgcode : $("#taxorgcodeInput").val(),
					yearMonths : $("#createTimeInput").val()
			   }
	  CoreUtil.sendPost("/gas/analyse/regionranking/groupYearMonth", map, function (res) {
			if (res.code == '0') {
				var _data = res.data;
				var data0 = _data[0];
  			    var xAxisData = _data[1];
  			    var titleText = _data[2];
  			
	  			if(CoreUtil.isEmpty(data0)){
	  				layer.msg(titleText + "暂无数据！");
	  				return false;
	  			}
  			
				var option = {
		               title: {
		                   text: titleText
		               },
		               legend: {
		                   
		            	   data:[]
		               },
		               tooltip: {},
		               xAxis: {
		            	   type: 'category',
		            	   data: xAxisData

		               },
					   yAxis: {
					   },
		               series: [{
		            	   name: '销售额',
		            	   type: 'line',
		                   data: data0,
		                   smooth:true,
		               }]
					   
				}
				// 使用刚指定的配置项和数据显示图表。
		        myChart.setOption(option);
		        window.addEventListener("resize", function () {
		            myChart.resize();
		        });
		        
			}else{
      			layer.msg("/gas/staytime/paytaxGroupYearMonth初始化失败："+res.msg);
      		}
		});
	  
  };
</script>